writing_for_the_webfandomcom-20200214-history
Top 10 Mistakes in Web Site Design
The following is a great article from Jakob Nielsen from the Nielsen Norman Group that covers 10 big errors in designing a web page. Nielsen Norman Group is a web company that specializes in user experience and research on maximizing web design for their clients. The article is located here: http://www.nngroup.com/articles/top-10-mistakes-web-design/ Summary: The ten most egregious offenses against users. Web design disasters and HTML horrors are legion, though many usability atrocities are less common than they used to be. Using a Bad Search tool Overly literal search engines reduce usability in that they're unable to handle typos, plurals, hyphens, and other variants of the query terms. Such search engines are particularly difficult for elderly users, but they hinder the usability of the site for all users. A related problem is when search engines prioritize results purely on the basis of how many query terms they contain, rather than on each document's importance. It is much better if your search engine calls out "best bets" at the top of the list — especially for important queries, such as the names of your products. Search is the user's lifeline when navigation fails. Even though advanced search can sometimes help, simple search is what is usually relied upon. Search functions should be presented as a simple box as that seems to be a standard that most users recognize. PDF Files for Online Reading Users hate coming across a PDF file while browsing, because it breaks their flow. Even simple things like printing or saving documents are difficult because standard browser commands don't work. Layouts are often optimized for a sheet of paper, which rarely matches the size of the user's browser window. PDF documents scroll differently and will not allow users to change font size to optimize readability. Worst of all, PDFs themselves rarely have navigation built within them, skimming for content is more difficult. PDF is great for printing and for distributing manuals and other long documents that need to be printed. Reserve it for this purpose and convert any information that needs to be browsed or read on the screen into an HTML-based web page. Not Changing the Color of Visited Links Visual cues indicating past navigation help users understand their current location. Knowing past and present locations in turn makes it easier to decide where to go next. Links are a key factor in this navigation process. Users can exclude links that proved fruitless in their earlier visits. Conversely, they might revisit links they found helpful in the past. Most importantly, knowing which pages they've already visited frees users from unintentionally revisiting the same pages over and over again. These benefits are only valid, however, if users can tell the difference between visited and unvisited links because the site shows them in different colors. When visited links don't change color, users exhibit more navigational disorientation in usability testing and unintentionally revisit the same pages repeatedly. Non-Scannable Text A wall of text is deadly for an interactive experience. Users find it to be intimidating, boring, and painful to read. To draw users into the text and support scannability, use well-documented tricks: * subheadings * bullet lists * highlighted keywords * short paragraphs with spaces between them * utilizing the writing style of the inverted pyramid, so that critical information is presented first * a simple writing style * clear language with limited use of jargon Fixed Font Size CSS can disable a Web browser's "change font size" button and specify a fixed font size. Respect the users' preferences and let them resize text as needed. Also, specify font sizes in relative terms — not as an absolute number of pixels. Page Titles With Low Search Engine Visibility Search engines are the most common way users discover websites. The page's title is the web developer's main tool to attract new visitors from search listings and to help existing users to locate specific pages. The page title is contained within the HTML tag and is almost always used as the clickable headline for listings on search engine result pages (SERP). Search engines typically show the first 66 characters of the title. Page titles are also used as the default entry when users bookmark a site. For your homepage, begin with the company name, followed by a brief description of the site. Titles beginning with the words "The" or "Welcome to" will be alphabetized under "T" or "W". For pages other than the homepage, start the title with a few words of the most salient information-carrying words that describe the specifics of what users will find on that page. Since the page title is used as the window title in the browser, it's also used as the label for that window in the task bar under Windows. This double usage means that advanced users will move between multiple windows under the guidance of the first one or two words of each page title. If all page titles start with the same words, usability for multi-window users will be severely reduced. Taglines on homepages are a related subject: they also need to be short and quickly communicate the purpose of the site. Anything that Looks Like an Advertisement Selective attention is very powerful, and web users have learned to stop paying attention to any ads that get in the way of their goal-driven navigation. The primary exception is text-only search-engine ads. Unfortunately, users also ignore legitimate design elements that look like prevalent forms of advertising. Therefore, it is best to avoid any designs that look like advertisements. The exact implications of this guideline will vary with new forms of ads; currently follow these rules: * banner blindness means that users never fixate their eyes on anything that looks like a banner ad due to shape or position on the page * animation avoidance makes users ignore areas with blinking or flashing text or other aggressive animations * pop-up purges mean that users close pop-up windows before they have even fully rendered Violating Design Conventions Consistency is one of the most powerful usability principles: when things always behave the same, users don't have to worry about what will happen. Instead, they know what will happen based on prior experience. The more users' expectations prove right, the more they will feel in control of the system. The more the system breaks users' expectations, the more they will feel insecure. Jakob's Law of the Web User Experience states that "users spend most of their time on other websites." This means that they form their expectations for sites based on what is commonly done on most other sites. Users spend less time on sites that deviate from common design conventions. Links that open in new browser windows Designing the site so that clicked links open in new browser windows is like a vacuum cleaner sales person who starts a visit by emptying an ash tray on the customer's carpet. Don't pollute my screen with any more windows, thanks. Designers open new browser windows on the theory that it keeps users on their site, but the strategy is self-defeating because it disables the Back button. This key navigational feature is critical to most users. Users often don't notice that a new window has opened, especially if they are using a small monitor where the windows are maximized to fill up the screen. Links that don't behave as expected undermine users' understanding of their own system. Users hate unwarranted pop-up windows. When they want the destination to appear in a new page, they can use their browser's "open in new window" command. Not Answering Users' Questions Web users are highly goal-driven. They visit sites because there's something they want to accomplish — perhaps purchasing a product. The ultimate failure of a website is to not provide the information users are looking for. Sometimes the answer is simply not there, and you lose the sale because users have to assume that your product or service doesn't meet their needs when specifics are not provided. Other times the specifics are buried under a thick layer of marketese and bland slogans. Since users don't have time to read everything, such hidden info might as well not be present. The worst example of not answering users' questions is avoiding listing the price of products and services. No B2C e-commerce site would make this mistake, but it's rife in B2B, where most "enterprise solutions" are presented so that you can't tell whether they are suited for 100 people or 100,000 people. Price is the most specific piece of info customers use to understand the nature of an offering, and not providing it makes people feel lost and reduces their understanding of a product line. Even B2C sites often make the associated mistake of forgetting prices in product lists, such as category pages or search results. Knowing the price is key in both situations; it lets users differentiate among products and click through to the most relevant ones.